<!--

## props配置项

1. 功能：让组件接收外部传过来的数据
2. 传递数据：```<Demo name="xxx"/>```
3. 接收数据：
   - 1）. 第一种方式（只接收）：```props:['name'] ```
   - 2）. 第二种方式（限制类型）：```props:{name:String}```
   - 3）. 第三种方式（限制类型、限制必要性、指定默认值）：
       ```
         props:{
             name:{
             type:String, //类型
             required:true, //必要性
             default:'老王' //默认值
             }
         }
       ```
> 备注：props是只读的，Vue底层会监测你对props的修改，如果进行了修改，就会发出警告，若业务需求确实需要修改，那么请复制props的内容到data中一份，然后去修改data中的数据。

-->

<template>
  <div>
    <Student name="张飒飒" :age="18"></Student>
    <!-- 其中age使用v-bind:的形式，进行js表达式计算，就可以获取到的是数值类型，而不是字符串类型，之后Student组件接收到的就是数值类型了 -->
    <Student name="李思思" :age="18"></Student>
  </div>
</template>

<script>
// 第一步：引入组件，其中在脚手架里面，后缀.vue写不写都可以
import Student from './components/Student.vue'

export default {
  name: 'App',
  // 第二步：注册组件
  // components: {
  //   School,
  //   Student,
  // }
  // 使用对象写法
  components: {
    Student,
  },
  data() {
    return {
      msg: '欢迎学习Vue'
    }
  },

}
</script>

<style scoped>

</style>